<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
  <h1>{{info}}</h1>
  <ul>
    <li v-for="name in arr">{{name}}</li>
  </ul>
<table border="1">
  <tr>
    <th>编号</th>
    <th>名字</th>
    <th>年龄</th>
    <th>性别</th>
  </tr>
  <tr v-for="(p,i) in persons">
    <td>{{i+1}}</td>
    <td>{{p.name}}</td>
    <td>{{p.age}}</td>
    <td>{{p.gender}}</td>
  </tr>
</table>
</div>
<script src="js/vue.min.js"></script>
<script>
  let v= new Vue({
    el:"body>div",
    data:{
      info:"循环",
      arr:["东方月初","涂山红红","王权富贵","清瞳"],
      persons:[{name:"颜如玉",age:20000,gender:"男"},
        {name:"涂山荣荣",age: 30000,gender: "女"},
        {name:"孙悟空",age:200000,gender: "猴"}]
    }
  })
</script>
</body>
</html>